<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- 引入JQuery -->
<script type="text/javascript"
	src="${pageContext.request.contextPath}/jquery-easyui-1.4.1/jquery.min.js"></script>
<!-- 引入EasyUI -->
<script type="text/javascript"
	src="${pageContext.request.contextPath}/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
<!-- 引入EasyUI的中文国际化js，让EasyUI支持中文 -->
<script type="text/javascript"
	src="${pageContext.request.contextPath}/jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
<!-- 引入EasyUI的样式文件-->
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/jquery-easyui-1.4.1/themes/default/easyui.css"
	type="text/css" />
<!-- 引入EasyUI的图标样式文件-->
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/jquery-easyui-1.4.1/themes/icon.css"
	type="text/css" />
</head>
<script type="text/javascript">
$(function(){
	//更改底部工具栏
	var pager = $('#dishList').datagrid('getPager');	
	  pager.pagination({
		pageList: [10,20,30],
	});
	
})

//点击添加菜单按钮
function adddish() {
	$('#adddishdiv').window('open'); 
}
//清除增加菜名
function clearForm() {
	$('#adddishform').form('clear');
}
//确定增加菜品
function submitForm() {
	$('#adddishform').form({
		url:"addDish",
		success:function(data){
			$.messager.confirm('菜单数据确认','是否要增加这条数据',function(r){
				//如果选择了确定增加
				if(r){
	       			 if(data==1){
	        			$.messager.alert('提示','增加成功','info',function(){					
	        				//增加成功后刷新该页面，并且隐藏增加框
							$('#dishList').datagrid('reload');
							$('#adddishdiv').window('close'); 
	      		 		 });
	      		  	}else{
	        			$.messager.alert('提示','增加失败');
	       		 	}    
				}
			
			})
		}
	})
	$('#adddishform').submit(); 
}
//点击修改菜单
function editdish() {
	var data=$('#dishList').datagrid('getSelections');
	if(data.length==0){
		$.messager.show({
			title:'警告',
			msg:'请选择要修改的菜品',
			timeout:1000,
			showType:'slide',
			style:{
				left:50,
				top:100
			}
		});
	}else if(data.length>=2){
		$.messager.show({
			title:'警告',
			msg:'只能选择一条菜品信息',
			timeout:1000,
			showType:'slide',
			style:{
				left:50,
				top:100
			}
		});
	}else{
		$('#updatedishdiv').window('open');
		var sdata=$('#dishList').datagrid('getSelected');
		//这里一定要通过id赋值
		$('#did').textbox('setValue',sdata.did); 
		$('#dname').textbox('setValue',sdata.dname); 
		$('#dprice').textbox('setValue',sdata.dprice); 
		$('#dnumber').textbox('setValue',sdata.dnumber); 
		$('#usname').combobox('setValue',sdata.sname); 
	}

}
//确定修改菜单
function sureupdate() {
	$('#updatedishform').form('submit',{
		url:"updateDish",
		success:function(data){
			$.messager.confirm('数据确认','是否要修改这条数据',function(r){
				//如果选择了确定增加
				if(r){
	       			 if(data==1){
	        			$.messager.alert('提示','修改成功','info',function(){					
	        				//修改成功后刷新该页面，并且隐藏增加框
							$('#dishList').datagrid('reload');
							$('#updatedishdiv').window('close'); 
	      		 		 });
	      		  	}else{
	        			$.messager.alert('提示','修改失败');
	       		 	}    
				}
			
			})
		}
	})

	
}
//取消修改
function cancleupdate() {
	$('#updatedishdiv').window('close');
	
}
//删除菜品
function deletedish() {
	//获取被选中的需要删除的数据
	var data=$('#dishList').datagrid('getSelections');
	if(data.length==0){
		$.messager.show({
			title:'警告',
			msg:'请选择要删除的菜品',
			timeout:1000,
			showType:'slide',
			style:{
				left:50,
				top:100
			}
		});
	}else{
		//声明一个空的数组来装选中的学生的id
		var dids=[];
		for (var i = 0; i < data.length; i++) {
			dids.push(data[i].did);
		}
		//消息提示框，是否要删除
		$.messager.confirm('数据确认','是否要删除'+data.length+'条数据',function(r){
			//如果选择了确定删除
			if(r){
				//通过ajax请求将对应数据发送到后台，由后台写回来一个文本
				$.ajax({
					type:"post",
					url:'deleteDish',
					data:{"dids":dids},
					dataType:"text",
					success:function(data){
						if(data=="1"){
							//提示删除成功
							$.messager.alert('提示','删除成功','info',function(){
								//删除成功后刷新该页面
								$('#dishList').datagrid('reload');
							});
						}else{
							//提示删除失败
							$.messager.alert('提示','删除失败');
						}
					}
				});
			}else{
				$('#dishList').datagrid('uncheckAll');
			}
		});
	}
}
function getChanges() {
	var sname=$('#search').val();
	 $("#dishList").datagrid({
		 title:'searchBox',  
         iconCls:'icon-ok',  
         width:600,  
         pageSize:10,  
         pageList:[5,10,15,20],  
         nowrap:true,  
         striped:true,  
         collapsible:true,  
         toolbar:"#toolbar", 
         method:"post",
         url:'findDishbysearch?sname='+sname, 
         loadMsg:'数据加载中......',  
         fitColumns:true,//允许表格自动缩放,以适应父容器    
         remoteSort:false,  
         columns : [ [ {  
             field : 'ck',  
             checkbox:"true", 
            
         },{  
             field : 'did',  
             hidden:"true", 
             title : '菜id'  
         }, {  
             field : 'dname',  
             width : 60,  
             title : '菜名'  
         }, {  
             field : 'dnumber',  
             width : 50,   
             title : '菜数量'  
         },{  
             field : 'dprice',  
             width : 50,  
             title : '菜品价格'  
         }, {  
             field : 'sname',  
             width : 60,  
             title : '菜系'  
         },{  
             field : 'rname',  
             hidden:"true", 
             title : '餐馆名'  
         }] ],  
         pagination : true,  
         rownumbers : true 
	 })
}

</script>
<body>

	<table id="dishList" title="菜品查询" class="easyui-datagrid"
		toolbar="#toolbar" pagination="true" fit="true" url="findAlldish"
		striped="true" rownumbers="true" fitColumns="true" border="false">
		<thead>
			<tr>
				<th field="ck" checkbox=true></th>
				<th field="did" hidden="true">菜品编号</th>
				<th field="dname" width='60' resizable='false'>菜名</th>
				<th field="dnumber" width='50' resizable='true'>菜数量</th>
				<th field="dprice" width='50' resizable='true'>菜品价格</th>
				<th field="sname" width='60' resizable='true'>菜系</th>
				<th field="rname" hidden="true">餐馆名</th>
			</tr>
		</thead>
	</table>
	<div id="toolbar">
		<a href="javascript:void(0)" class="easyui-linkbutton"
			iconCls="icon-add" plain="true" onclick="adddish()">添加菜单</a> <a
			href="javascript:void(0)" class="easyui-linkbutton"
			iconCls="icon-edit" plain="true" onclick="editdish()">修改菜单</a> <a
			href="javascript:void(0)" class="easyui-linkbutton"
			iconCls="icon-remove" plain="true" onclick="deletedish()">删除菜单</a> <a
			href="javascript:void(0)" class="easyui-linkbutton"
			data-options="iconCls:'icon-search',plain:true"
			onclick="getChanges()">输入菜系搜索</a> <input id="search"
			class="easyui-textbox" type="text"></input>
	</div>

	<!-- 增加菜单的表单 -->
	<div id="adddishdiv" class="easyui-window" closed="true" title="增加学生"
		style="width: 400px">
		<div style="padding: 10px 60px 20px 60px">
			<form id="adddishform" method="post">
				<table cellpadding="5">
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜名:</td>
						<td><input class="easyui-textbox" type="text" name="dname"
							data-options="required:true,missingMessage:'请输入菜名'"></input></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜供应数量:</td>
						<td><input class="easyui-textbox" type="text" name="dnumber"
							data-options="required:true,missingMessage:'请输入供应数量'"></input></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜系:</td>
						<td><select id="sname" class="easyui-combobox" name="sname"
							style="width: 150px;" url="showstyle" textField="sname"
							type="post">

						</select></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>价格:</td>
						<td><input class="easyui-textbox" type="text" name="dprice"
							data-options="required:true,missingMessage:'请输入价格'"></input></td>
					</tr>
				</table>
			</form>
			<div style="text-align: center; padding: 5px">
				<a href="javascript:void(0)" class="easyui-linkbutton"
					onclick="submitForm()">确定</a> <a href="javascript:void(0)"
					class="easyui-linkbutton" onclick="clearForm()">清除</a>
			</div>
		</div>
	</div>
	<!-- 修改菜单 -->
	<div id="updatedishdiv" class="easyui-window" closed="true" title="回复"
		style="width: 400px">
		<div style="padding: 10px 60px 20px 60px">
			<form id="updatedishform" method="post">
				<table cellpadding="5">
					<tr>
						<td>菜品编号:</td>
						<td><input class="easyui-textbox" type="text" id="did"
							name="did" editable="false"></input></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜名:</td>
						<td><input class="easyui-textbox" type="text" id="dname"
							name="dname" data-options="required:true,missingMessage:'请输入菜名'"></input></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜供应数量:</td>
						<td><input class="easyui-textbox" type="text" id="dnumber"
							name="dnumber"
							data-options="required:true,missingMessage:'请输入供应数量'"></input></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>菜系:</td>
						<td><select id="usname" class="easyui-combobox" name="sname"
							style="width: 150px;" url="showstyle" textField="sname"
							type="post">


						</select></td>
					</tr>
					<tr>
						<!-- 一定要写name属性,因为controller里面的req.getParameter()里面要填的和name一样 -->
						<td>价格:</td>
						<td><input class="easyui-textbox" type="text" id="dprice"
							name="dprice" data-options="required:true,missingMessage:'请输入价格'"></input></td>
					</tr>
				</table>
			</form>
			<div style="text-align: center; padding: 5px">
				<a href="javascript:void(0)" class="easyui-linkbutton"
					onclick="sureupdate()">确定</a> <a href="javascript:void(0)"
					class="easyui-linkbutton" onclick="cancleupdate()">取消</a>
			</div>
		</div>
	</div>

</body>
</html>